<template>
	<view>
		<view class="userpage-top">
			<view class="portrait-box" >
				<!-- <image class="portrait" :src="portraitpath" @error="imageError" @click="toself"></image> -->
				<image class="portrait" :src="portraitpath" @click="toself"></image>
			</view>
			<view class="usernews" >
				<!-- 用户名+性别 -->
				<view v-if="selfFrom.sex=='男'">
					<uni-icons type="person-filled" size="20" style="color: #007AFF;"></uni-icons>
					<text selectable='true' @click="toself" style="font-weight: 1000;">{{selfFrom.username}}</text>
				</view>
				<view v-else-if="selfFrom.sex=='女'">
					<uni-icons type="person-filled" size="20" style="color: #f894f8;"></uni-icons>
					<text selectable='true' @click="toself" style="font-weight: 1000;">{{selfFrom.username}}</text>
				</view>
				<!-- 个性签名：离群索居者，不是神灵，便是野兽 -->
				<view class="userdesc" v-if="(selfFrom.userdesc).length>18">
					<text selectable='true' @click="toself" style="font-size: 13px;font-weight: 600;">{{selfFrom.userdesc.substr(0, 18)+'...'}}</text>
				</view>
				<view class="userdesc" v-else-if="(selfFrom.userdesc).length<=18">
					<text selectable='true' @click="toself" style="font-size: 13px;font-weight: 600;">{{selfFrom.userdesc}}</text>
				</view>
				<!-- 上次登录时间 -->
				<view class="lastlogin" v-if="selfFrom.last_login">
					<text selectable='true' @click="toself" style="font-size: 10px;">{{'上次登录：' + selfFrom.last_login}}</text>
				</view>
			</view>
		</view>
		<view class="">
			<uni-list>
				<uni-list-item :show-extra-icon="true" showArrow v-for="(item, index) in listData" :key="index" :title="item.name" :to="item.url":extra-icon="item.icon" />
				<uni-list-item v-if="selfFrom.is_superuser==true" :show-extra-icon="true" showArrow :title="'后台'" :to="'../admin/admin'" :extra-icon="adminicon"/>
				<!-- <uni-list-item v-if="selfFrom.is_superuser==true" :show-extra-icon="true" showArrow :title="'后台'" :to="adminurl" :extra-icon="adminicon"/> -->
			</uni-list>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				adminurl: '',
				adminicon: {
					color: '#333333',
					size: '20',
					type: 'info-filled'
				},
				selfFrom: {},
				portraitpath: '',
				listData: [
					{
						name: '账户余额',
						url: './golds',
						icon: {
							color: '#333333',
							size: '20',
							type: 'circle-filled'
						},
					},
					{
						name: '标签管理',
						url: './labels',
						icon: {
							color: '#333333',
							size: '20',
							type: 'navigate-filled'
						},
					},
					{
						name: '地址足迹',
						url: './address',
						icon: {
							color: '#333333',
							size: '20',
							type: 'map-filled'
						},
					},
					{
						name: '密码找回',
						url: './forgeth',
						icon: {
							color: '#333333',
							size: '20',
							type: 'locked-filled'
						},
					},
					{
						name: '通讯录',
						url: './userdata',
						icon: {
							color: '#333333',
							size: '20',
							type: 'personadd-filled'
						},
					},
					{
						name: '邀请码',
						url: './invite',
						icon: {
							color: '#333333',
							size: '20',
							type: 'paperplane-filled'
						},
					},
					{
						name: '设置',
						url: './serverset',
						icon: {
							color: '#333333',
							size: '20',
							type: 'gear-filled'
						},
					},
					// 头像用户名展示，跳转个人信息管理
					// 账户余额，跳转金币
					// 邀请码，跳转邀请码管理界面，生成和使用次数和失效显示
					// 地址足迹，跳转用户地址管理和历史记录
					// 标签管理，跳转新建标签和添加标签
					// 通讯录好友，跳转获取通讯录，并根据通讯录搜索有谁是好友
					// 密码找回记录
				]
			}
		},
		// 监听原生导航栏按钮点击事件，跳转到新建页面
		onNavigationBarButtonTap(e) {
			this.selfFrom = {}
			uni.navigateTo({
				url: "../login/login"
			})
			// this.selfFrom = {}
			// uni.clearStorageSync();
		},
		onShow() {
			this.getself ()
		},
		mounted() {
			// this.selfFrom = {}
			this.adminurl = uni.getStorageSync('urlip') +'/admin'
		},
		methods: {
			async getself () {
					const {
						data: res
					} = await this.$http.get('self/')
					// console.log(res.data[0])
					this.selfFrom = res.data[0]
					this.portraitpath = res.data[0].portrait
					if (res.code !== 200) {
						return uni.showModal({
							title: '通知',
							content: res.msg,
							showCancel: false
						})
					}
			},
			toself () {
				uni.navigateTo({ url: './userself' })
				// this.selfFrom = {}
			},
			toadmin () {
				// window.location.href='https://www.eatqionline.com/';
				uni.navigateTo({ url: '../admin/admin' })
				// this.selfFrom = {}
			},
		}
	}
</script>

<style>
.userpage-top {
	height: 90px;
	display: flex;
	flex-flow: row nowrap;
}
.portrait-box {
	margin-top: 5px;
	margin-left: 10px;
	width: 80px;
	height: 80px;
	background-color: #ffffff;
}
.portrait {
	/* margin-top: 5px; */
	width: 80px; 
	height: 80px;
}
.usernews {
	margin-left: 10px;
	margin-top: 12px;
}
</style>